<template>
  <panel title="懂生活">
    <div class="container">
      <m-lavel icls="iconfont icon-lvzhou_yuyanqiehuan" text="分现金" tip="分现金" @clickItem="handleClick" />
      <m-lavel icls="iconfont icon-shebaogongjijin" text="公积金查询" @clickItem="handleClick" />
      <m-lavel icls="iconfont icon-xinyongqia" text="办信用卡" @clickItem="handleClick" />
      <m-lavel icls="iconfont icon-xinyongqiahuankuan" text="信用卡还款" tip="无费用" @clickItem="handleClick" />
      <m-lavel icls="iconfont icon-zhuanzhang" text="转账" @clickItem="handleClick" />
      <m-lavel icls="iconfont icon-weibiaoti2fuzhi20" text="手机充值" />
      <m-lavel icls="iconfont icon-zhangdan" text="话费账单" @clickItem="handleClick"/>
      <m-lavel icls="iconfont icon-dianying" text="电影" @clickItem="handleClick"/>
      <m-lavel icls="iconfont icon-huankuanjihua" text="还款计划" @clickItem="handleClick"/>
      <m-lavel icls="iconfont icon-gou" text="莱茨狗" @clickItem="handleClick"/>
      <m-lavel icls="iconfont icon-shebaochaxun" text="社保查询" @clickItem="handleClick"/>
      <m-lavel icls="iconfont icon-zhanghu" text="百信电子账户" @clickItem="handleClick"/>
      <m-lavel icls="iconfont icon-changyonglogo32" text="爱奇艺会员" tip="95折" @clickItem="handleClick"/>
    </div>
  </panel>
</template>

<script>
import Panel from '@/components/core/panel.vue'
import MLavel from '@/pages/comm-comp/m-label/m-label.vue'

export default {
  name: 'i-life',
  components: { Panel, MLavel },
  methods: {
    handleClick (text) {
      console.log(text)
    }
  }
}
</script>
<style lang="scss" scoped>
@import '~@/assets/css/element.scss';
.container {
  @include list(row);
  flex-wrap: wrap;
}
</style>
